<script>
export default {
  created() {
    if (localStorage.getItem('userId')) {
      this.order_init()
    } else {
      this.$message.error('请登录！')
      this.$router.push('/login')
    }
  },
  data() {
    return {
      order_list: [],
    }
  },
  methods: {
    async order_init() {
      const { data: res } = await this.$http.get(
        '/flower-order/init/' + localStorage.getItem('userId')
      )
      this.order_list = res.data
    },
  },
}
</script>
<template>
  <div class="app">
    <header>
      <a href="/"><img src="../images/logo.png" /></a>
    </header>
    <section>
      <div v-for="item in order_list" :key="item.orderId">
        <div class="header">
          <span style="float: left">订单编号：{{ item.orderId }}</span>
          <span style="float: right">下单时间：{{ item.orderTime }}</span>
        </div>
        <div class="body">
          <img :src="$api + '/common/download/' + item.orderImg" />
          <span class="img_msg">{{ item.orderName }}</span>
          <h3 style="color: red">￥{{ item.orderPrice }}</h3>
          <span style="position: absolute; right: 500px; top: 60px">{{
            item.orderCount
          }}</span>
          <label style="position: absolute; right: 200px; top: 60px; color: red"
            >已完成</label
          >
        </div>
      </div>
    </section>
  </div>
</template>

<style lang="less" scoped>
@import url('@/views/css/order.less');
</style>
